<template>
  <el-radio-group @change="loadContents()" v-model="type">
    <el-radio-button v-for="c in catTypeArr" :label="c.type">{{c.name}}</el-radio-button>
  </el-radio-group>
  <el-button type="primary" style="margin-left: 20px;margin-top: 5px"
             @click="router.push('/personal/post')">发布内容</el-button>
  <el-table :data="arr">
    <el-table-column label="编号" type="index" width="80px"></el-table-column>
    <el-table-column label="标题" prop="title" width="200px"></el-table-column>
    <el-table-column label="分类" prop="categoryName"></el-table-column>
    <el-table-column label="浏览量" prop="viewCount"></el-table-column>
    <el-table-column label="评论量" prop="commentCount"></el-table-column>
    <el-table-column label="发布时间" prop="createTime"></el-table-column>
    <el-table-column label="操作" width="200px">
      <template #default="scope">
        <el-button type="success" @click="edit(scope.row)">编辑</el-button>
        <el-button type="danger" @click="del(scope.$index,scope.row)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script setup>
import {onMounted, ref} from "vue";
import {ElMessage} from "element-plus";
import router from "@/router";
import axios from "axios";
import qs from "qs";

const edit = (c)=>{
  router.push('/personal/post?id='+c.id);
}
const del = (i,c)=>{
  if (confirm("您确认删除此内容吗?")){
    axios.post('http://localhost:8080/v1/contents/'+c.id+"/delete")
    .then((response)=>{
      if (response.data.code==2001){
        arr.value.splice(i,1);
        ElMessage.success("删除完成!");
      }
    })

  }
}
const arr = ref([]);
const type = ref('1');
const catTypeArr = ref([]);

const loadContents = ()=>{
  let user = localStorage.user?JSON.parse(localStorage.user):null;
  let data = qs.stringify({userId:user.id,type:type.value});
  axios.get('http://localhost:8080/v1/contents/management?'+data)
      .then((response)=>{
        if (response.data.code==2001){
          arr.value = response.data.data;
        }
      })
}
onMounted(()=>{
  //请求内容数据
  loadContents();
  //请求类型数据
  axios.get('http://localhost:8080/v1/categories/type')
  .then((response)=>{
    if (response.data.code==2001){
      catTypeArr.value = response.data.data;
    }
  })



})
</script>

<style scoped>

</style>